<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
		"http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>doh.robot Select Test</title>

		<style>
			@import "../../../../util/doh/robot/robot.css";
		</style>

		<!-- required: dojo.js -->
		<script type="text/javascript" src="../../../../dojo/dojo.js"
			djConfig="isDebug: true, parseOnLoad: true"></script>
		<script type="text/javascript" src="../../helpers.js"></script>

		<script type="text/javascript">
			dojo.require("dijit.robotx");
			dojo.require("dojo.date");

			dojo.addOnLoad(function(){
				doh.robot.initRobot('../test_Select.html');

				// refs to parts of s1 Select
				var s1, s1menu, Tenessee, Virginia, Washington,	// s1 select
					s8a, s8a_menu, s8b, s8b_menu;				// long list selects

				// log of calls to onChange handler
				var changes = [];

				doh.register("setup",
					function setUp(){
				    	s1 = dijit.byId('s1');
						s1_menu = dijit.byId('s1_menu');
						doh.t(s1, "s1 select exists");
						doh.t(s1_menu, "s1 menu exists");
						
						s8a = dijit.byId('s8a');
						s8a_menu = dijit.byId('s8a_menu');
						s8b = dijit.byId('s8b');
						s8b_menu = dijit.byId('s8b_menu');
				    }
				);

				doh.register("mouse", [
					{
						name: "two clicks to select",
						timeout: 60000,
						runTest: function(){
							var d = new doh.Deferred();

							// click to open drop down
							doh.robot.mouseMoveAt(s1.domNode, 500);
							doh.robot.mouseClick({left:true}, 500);
							doh.robot.sequence(d.getTestErrback(function(){
								doh.t(isVisible(s1_menu), "drop down menu displayed after click");
								doh.is(5, dojo.query("tr", s1_menu.domNode).length, "5 options in menu")
								
								var selectedOptions = dojo.query(".dijitSelectSelectedOption .dijitMenuItemLabel", s1_menu.domNode);
								doh.is(1, selectedOptions.length, "one selected option");
								doh.is("Virginia", innerText(selectedOptions[0]), "Virginia highlighted");

								Washington = dojo.query("tr", s1_menu.domNode)[2];
								doh.t(Washington, "Washington is another menu choice");
							}), 500);

							// select an option in the drop down
							doh.robot.mouseMoveAt(function(){
								// function wrapper because Washington isn't defined until about sequence() runs
								return Washington;
							}, 500);
							doh.robot.mouseClick({left:true}, 500);
							doh.robot.sequence(d.getTestErrback(function(){
								doh.t(isHidden(s1_menu), "clicking choice hides menu");
								
								doh.is("Washington", innerText(s1.containerNode), "select shows selected option");
								doh.is("WA", s1.get("value"), "get(value) after selecting Washington");
							}), 500);

							// click to open drop down again
							doh.robot.mouseMoveAt(s1.domNode, 500);
							doh.robot.mouseClick({left:true}, 500);
							doh.robot.sequence(d.getTestErrback(function(){
								doh.t(isVisible(s1_menu), "drop down menu displayed after third click");
								
								var selectedOptions = dojo.query(".dijitSelectSelectedOption .dijitMenuItemLabel", s1_menu.domNode);
								doh.is(1, selectedOptions.length, "one selected option");
								doh.is("Washington", innerText(selectedOptions[0]), "Washington highlighted");
							}), 500);

							// clicking away should close the drop down
							doh.robot.mouseMove(10, 10, 500)
							doh.robot.mouseClick({left:true}, 500);
							doh.robot.sequence(d.getTestCallback(function(){
								doh.t(isHidden(s1_menu), "clicking away hides menu");
							}), 500);

							return d;
						}
					},

					{
						name: "mouse down, slide, mouse up",
						timeout: 60000,
						setUp: function(){
							s1.set("value", "VA");
						},
						runTest: function(){
							var d = new doh.Deferred();

							// mouse-down to open drop down
							doh.robot.mouseMoveAt(s1.domNode, 500);
							doh.robot.mousePress({left:true}, 500);
							doh.robot.sequence(d.getTestErrback(function(){
								doh.t(isVisible(s1_menu), "drop down menu displayed after mouse down");
								doh.is(5, dojo.query("tr", s1_menu.domNode).length, "5 options in menu")
								
								var selectedOptions = dojo.query(".dijitSelectSelectedOption .dijitMenuItemLabel", s1_menu.domNode);
								doh.is(1, selectedOptions.length, "one selected option");
								doh.is("Virginia", innerText(selectedOptions[0]), "Virginia highlighted");

								Washington = dojo.query("tr", s1_menu.domNode)[2];
								doh.t(Washington, "Washington is another menu choice");
							}), 500);

							// select an option in the drop down
							doh.robot.mouseMoveAt(function(){
								// function wrapper because Washington isn't defined until about sequence() runs
								return Washington;
							}, 500);
							doh.robot.mouseRelease({left:true}, 500);
							doh.robot.sequence(d.getTestErrback(function(){
								doh.t(isHidden(s1_menu), "clicking choice hides menu");
								
								doh.is("Washington", innerText(s1.containerNode), "select shows selected option");
								doh.is("WA", s1.get("value"), "get(value) after selecting Washington");
							}), 500);

							// mouse down to open drop down again
							doh.robot.mouseMoveAt(s1.domNode, 500);
							doh.robot.mousePress({left:true}, 500);
							doh.robot.sequence(d.getTestErrback(function(){
								doh.t(isVisible(s1_menu), "drop down menu displayed after second mouse down");
								
								var selectedOptions = dojo.query(".dijitSelectSelectedOption .dijitMenuItemLabel", s1_menu.domNode);
								doh.is(1, selectedOptions.length, "one selected option");
								doh.is("Washington", innerText(selectedOptions[0]), "Washington highlighted");
							}), 500);

							// mouse up away from node should leave drop down open
							doh.robot.mouseMove(10, 10, 500)
							doh.robot.mouseRelease({left:true}, 500);
							doh.robot.sequence(d.getTestErrback(function(){
								doh.t(isVisible(s1_menu), "mouse up away from menu leaves menu open");
							}), 500);

							// then another mouse click should close it
							doh.robot.mouseClick({left:true}, 500);
							doh.robot.sequence(d.getTestCallback(function(){
								doh.t(isHidden(s1_menu), "clicking on blank screen hides menu");
							}), 500);

							return d;
						}
					},
					{
						name: "maxHeight",
						timeout: 60000,
						runTest: function(){
							var d = new doh.Deferred();

							// open drop down
							doh.robot.mouseMoveAt(s8a.domNode, 500);
							doh.robot.mouseClick({left:true}, 500);
							doh.robot.sequence(d.getTestErrback(function(){
								doh.t(isVisible(s8a_menu.domNode), "drop down menu displayed after mouse down");
								
								var pos = dojo.position(s8a_menu.domNode);
								doh.t(pos.h >= 200, "height at least 200: " + pos.h);
								doh.t(pos.h < 220, "height including borders not much more than 200: " + pos.h);
							}), 500);

							// close drop down
							doh.robot.mouseMove(10, 10, 500)
							doh.robot.mouseClick({left:true}, 500);
							doh.robot.sequence(d.getTestCallback(function(){
								doh.t(isHidden(s8a_menu), "clicking on blank screen hides menu");
							}), 500);

							return d;
						}
					},

					// Not sure if this is good or not, but sometimes menu can overlap
					// the select itself.  In this case, mouse up should leave the menu open						
					{
						name: "menu overlaps select",
						timeout: 60000,
						runTest: function(){
							var d = new doh.Deferred();

							// open drop down
							doh.robot.mouseMoveAt(s8b.domNode, 500);
							doh.robot.mouseClick({left:true}, 500);
							doh.robot.sequence(d.getTestErrback(function(){
								doh.t(isVisible(s8b_menu.domNode), "drop down menu displayed after mouse click");

								var select = dojo.position(s8b.domNode),
									menu = dojo.position(s8b_menu.domNode);
								doh.t(menu.h >= 220, "menu has big height: " + menu.h);
								doh.t(menu.y < select.y && menu.y+menu.h > select.y+select.h,
									"menu overlaps select, select = " + dojo.toJson(select) + ", menu = " + dojo.toJson(menu));
							}), 500);

							// clicking again should select the option from the menu
							doh.robot.mouseClick({left:true}, 500);
							doh.robot.sequence(d.getTestCallback(function(){
								doh.t(isHidden(s8b_menu), "clicking again selects something from menu");
							}), 500);

							return d;
						}
					}

				]);

				doh.register("keyboard", [
					{
						name: "tabIndex",
						timeout: 60000,
						setUp: function(){
							dojo.byId("htmlSelect2").focus();
							dijit.byId("s2").set("disabled", true);
						},
						runTest: function(){
							var d = new doh.Deferred();

							// tab to s1
							doh.robot.keyPress(dojo.keys.TAB, 500, {});
							doh.robot.sequence(d.getTestErrback(function(){
								doh.is("s1", dojo.global.dijit._curFocus.id)
							}), 500);

							// tab to button after s1
							doh.robot.keyPress(dojo.keys.TAB, 500, {});
							doh.robot.sequence(d.getTestErrback(function(){
								doh.is("s1button", dojo.global.dijit._curFocus.id)
							}), 500);

							// tab again should skip disabled s2, and go to s3
							doh.robot.keyPress(dojo.keys.TAB, 500, {});
							doh.robot.sequence(d.getTestCallback(function(){
								doh.is("s3", dojo.global.dijit._curFocus.id)
							}), 500);

							return d;
						},
						tearDown: function(){
							dijit.byId("s2").set("disabled", false);
						}
					},
					{
						name: "selecting",
						timeout: 60000,
						setUp: function(){
							dojo.byId("htmlSelect2").focus();
						},
						runTest: function(){
							var d = new doh.Deferred();

							// tab to s1
							doh.robot.keyPress(dojo.keys.TAB, 500, {});
							doh.robot.sequence(d.getTestErrback(function(){
								doh.is("s1", dojo.global.dijit._curFocus.id)
							}), 500);

							// down arrow to open drop down and focus first item
							doh.robot.keyPress(dojo.keys.DOWN_ARROW, 500, {});
							doh.robot.sequence(d.getTestErrback(function(){
								doh.t(isVisible(s1_menu), "drop down menu displayed after down arrow");
								Tenessee = dojo.query("tr", s1_menu.domNode)[0];
								doh.is(Tenessee, dojo.global.dijit._curFocus, "focused on first menu item")
							}), 500);

							// down arrow to next menu choice
							doh.robot.keyPress(dojo.keys.DOWN_ARROW, 500, {});
							doh.robot.sequence(d.getTestErrback(function(){
								doh.t(isVisible(s1_menu), "drop down menu still displayed");
								Virginia = dojo.query("tr", s1_menu.domNode)[1];
								doh.is(Virginia, dojo.global.dijit._curFocus, "focused on second menu item")
							}), 500);

							// ENTER to select option
							doh.robot.keyPress(dojo.keys.ENTER, 500, {});
							doh.robot.sequence(d.getTestCallback(function(){
								doh.t(isHidden(s1_menu), "drop down menu closes after ENTER key");
								doh.is("VA", s1.get("value"));
							}), 500);

							return d;
						},
						tearDown: function(){
							dijit.byId("s1").set("value", "VA");
						}
					},
					{
						name: "ESC to close menu",
						timeout: 60000,
						setUp: function(){
							dojo.byId("htmlSelect2").focus();
						},
						runTest: function(){
							var d = new doh.Deferred();

							// tab to s1
							doh.robot.keyPress(dojo.keys.TAB, 500, {});
							doh.robot.sequence(d.getTestErrback(function(){
								doh.is("s1", dojo.global.dijit._curFocus.id)
							}), 500);

							// down arrow to open drop down and focus first item
							doh.robot.keyPress(dojo.keys.DOWN_ARROW, 500, {});
							doh.robot.sequence(d.getTestErrback(function(){
								doh.t(isVisible(s1_menu), "drop down menu displayed after down arrow");
								Tenessee = dojo.query("tr", s1_menu.domNode)[0];
								doh.is(Tenessee, dojo.global.dijit._curFocus, "focused on first menu item")
							}), 500);

							// ESC to close menu
							doh.robot.keyPress(dojo.keys.ESCAPE, 500, {});
							doh.robot.sequence(d.getTestCallback(function(){
								doh.t(isHidden(s1_menu), "drop down menu closes after ENTER key");
								doh.is("VA", s1.get("value"), "value hasn't changed");
							}), 500);

							return d;
						},
						tearDown: function(){
							dijit.byId("s1").set("value", "VA");
						}
					}
				]);

				doh.register("display", [
					{
						name: "empty drop down",
						timeout: 60000,
						runTest: function(){
							var d = new doh.Deferred();

							// Open widget w/no choices
							var s6 = dijit.byId("s6");
							doh.robot.mouseMoveAt(s6.domNode, 500);
							doh.robot.mouseClick({left:true}, 500);
							doh.robot.sequence(d.getTestCallback(function(){
								var menu = dijit.byId("s6_menu"),
									trs = dojo.query("tr", menu.domNode);
								doh.is(1, trs.length, "one entry in menu");
								doh.is("", innerText(dojo.query(".dijitMenuItemLabel", trs[0])), "blank");
							}), 500);

							return d;
						}
					},

					// Currently (for better or worse) the select's width changes based on which option
					// is selected.   Make sure that the drop down is wide enough to show all entries,
					// even when a narrow entry is selected.
					{
						name: "width",
						timeout: 60000,
						runTest: function(){
							var d = new doh.Deferred();

							var s5 = dijit.byId("s5"),
								s5_menu = dijit.byId("s5_menu"),
								menuSize;

							// originally s5 is narrow
							var s5origSize = dojo.position(s5.domNode);

							// Open drop down menu and make sure it's wider than the select
							// (to display "no move" and "no copy" choices)
							doh.robot.mouseMoveAt(s5.domNode, 500);
							doh.robot.mouseClick({left:true}, 500);
							doh.robot.sequence(d.getTestErrback(function(){
								menuSize = dojo.position(s5_menu.domNode);
								doh.t(menuSize.w > s5origSize.w, "menu (" + menuSize.w + ") wider than select (" + s5origSize.w + ")");
							}), 500);

							// Select last entry in the drop down.   Should make the select wider.
							doh.robot.mouseMoveAt(function(){
								return dojo.query("tr", s5_menu.domNode)[4];
							}, 500);
							doh.robot.mouseClick({left:true}, 500);
							doh.robot.sequence(d.getTestCallback(function(){
								var s5newSize = dojo.position(s5.domNode);
								doh.t(s5newSize.w > s5origSize.w, "select changed width from " + s5origSize.w + " to " + s5newSize.w);
							}), 500);
				
							return d;
						}
					}
				]);

				doh.run();
			});
		</script>
	</head>
</html>
